﻿<!DOCTYPE HTML>
<html lang="zh-cn" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>我的账户</title>

  <link href="/plugins/bootstrap-3.3.0/css/bootstrap.min.css" rel="stylesheet"/>
  <link href="/plugins/material-design-iconic-font-2.2.0/css/material-design-iconic-font.min.css"
        rel="stylesheet"/>
  <link href="/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet"/>
  <link href="/plugins/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet"/>
  <link href="/plugins/bootstrap-table-1.11.0/bootstrap-table.min.css" rel="stylesheet"/>
  <link href="/plugins/waves-0.7.5/waves.min.css" rel="stylesheet"/>
  <link href="/plugins/jquery-confirm/jquery-confirm.min.css" rel="stylesheet"/>

  <!--select2-->
  <link href="https://cdn.bootcss.com/select2/4.0.3/css/select2.min.css" rel="stylesheet"/>

  <link href="/app/css/account.css" rel="stylesheet"/>
</head>
<body>
<div id="main">
  <div class="container-fluid">
    <div class="row">
      <!--col-md-6-->
      <div class="col-md-6">
        <div class="account-info">
          <h3>账户安全设置</h3>
          <form onsubmit="return false" id="updatePasswordForm">
            <div class="form-group">
              <label for="oldPassword">原密码</label>
              <input type="password" name="oldPassword" class="form-control" id="oldPassword" placeholder="Old Password">
            </div>
            <div class="form-group">
              <label for="password">新密码</label>
              <input type="password" name="password" class="form-control" id="password" placeholder="New Password">
            </div>
            <div class="form-group">
              <label for="newPassword">确认新密码</label>
              <input type="password" name="newPassword" class="form-control" id="newPassword" placeholder="Confirm Password">
              <p class="help-block">请牢记密码</p>
            </div>
            <button type="button" onclick="updSubmit();" style="background-color: #19be6b; color: #FFF" class="waves-effect waves-button">确定</button>
          </form>
        </div>
        <!--colmd6-->
      </div>
      <!--row-->
    </div>
  </div>
</div>

<script src="/plugins/jquery.1.12.4.min.js"></script>
<script src="/plugins/bootstrap-3.3.0/js/bootstrap.min.js"></script>
<script src="/plugins/bootstrap-table-1.11.0/bootstrap-table.min.js"></script>
<script src="/plugins/bootstrap-table-1.11.0/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="/plugins/waves-0.7.5/waves.min.js"></script>
<script src="/plugins/jquery-confirm/jquery-confirm.min.js"></script>
<script src="https://cdn.bootcss.com/moment.js/2.18.1/moment.min.js"></script>

<!--给form使用-->
<!-- select2 -->
<script src="https://cdn.bootcss.com/select2/4.0.3/js/select2.min.js"></script>
<script src="https://cdn.bootcss.com/select2/4.0.3/js/i18n/zh-CN.js"></script>

<!-- InputMask -->
<script src="/plugins/input-mask/jquery.inputmask.js"></script>
<script src="/plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
<script src="/plugins/input-mask/jquery.inputmask.extensions.js"></script>

<script src="/app/js/common.js"></script>
<script src="/app/js/i-ajax.js"></script>
<script>
function updSubmit() {
  var data = {};
  $('#updatePasswordForm').serializeArray().map(function (x) {
    data[x.name] = x.value;
  });
  var beforeSend = function () {
    if ($('#oldPassword').val() == '') {
      $('#oldPassword').focus();
      return false;
    }
    if ($('#password').val() == '') {
      $('#password').focus();
      return false;
    }
    if ($('#newPassword').val() != $('#password').val()) {
      $('#newPassword').focus();
      return false;
    }
  };
  var success = function (result) {
    $.confirm({
      theme: result.status == 'SUCCESS' ? 'light' : 'dark',
      animation: 'rotateX',
      closeAnimation: 'rotateX',
      title: false,
      content: result.msg,
      buttons: {
        confirm: {
          text: '确认',
          btnClass: 'waves-effect waves-button waves-light',
          action: function () {
            $("#updatePasswordForm input[type=password]").val('');
//            accountData.account.appId = data['appId'];
//            accountData.account.appKey = data['appKey'];
          }
        }
      }
    });
  };
  var error = function (jqXHR, textStatus) {
    $.confirm({
      theme: 'dark',
      animation: 'rotateX',
      closeAnimation: 'rotateX',
      title: false,
      content: textStatus != 'canceled' ? '系统异常' : '请检查密码与用户名',
      buttons: {
        confirm: {
          text: '确认',
          btnClass: 'waves-effect waves-button waves-light'
        }
      }
    });
  };
  var userId = parent.data.user.id;
  $.ajax({
    type: "PUT",
    url: '/sys/user/' + userId + '/password',
    data: data,
    beforeSend: beforeSend,
    success: success,
    error: error
  });
}
</script>
</body>
</html>